<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>数据平台</title>
    <link rel="stylesheet" href="${request.contextPath}/statics/css/bootstrap.min.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/css/bootstrap-datetimepicker.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/css/font-awesome.min.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/jqgrid/ui.jqgrid-bootstrap.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/ztree/css/metroStyle/metroStyle.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/css/main.css">
    <script src="${request.contextPath}/statics/libs/jquery.min.js"></script>
    <script src="${request.contextPath}/statics/plugins/layer/layer.js"></script>

    <script src="${request.contextPath}/statics/libs/bootstrap.min.js"></script>
    <script src="${request.contextPath}/statics/libs/moment.min.js"></script>
    <script src="${request.contextPath}/statics/libs/moment-with-locales.min.js"></script>
    <script src="${request.contextPath}/statics/libs/bootstrap-datetimepicker.min.js"></script>

    <script src="${request.contextPath}/statics/libs/vue.min.js"></script>
    <script src="${request.contextPath}/statics/plugins/jqgrid/grid.locale-cn.js"></script>
    <script src="${request.contextPath}/statics/plugins/jqgrid/jquery.jqGrid.min.js"></script>
    <script src="${request.contextPath}/statics/plugins/ztree/jquery.ztree.all.min.js"></script>

    <script src="${request.contextPath}/statics/js/common.js"></script>

    <script src="${request.contextPath}/statics/plugins/ztree/jquery.ztree.core.js"></script>
    <script src="${request.contextPath}/statics/plugins/ztree/jquery.ztree.exhide.js"></script>
    <script src="${request.contextPath}/statics/plugins/ztree/fuzzysearch.js"></script>
    <script src="${request.contextPath}/statics/libs/bootstrap-datetimepicker.min.js"></script>
    <script src="${request.contextPath}/statics/libs/ajaxupload.js"></script>

    <link rel="stylesheet" href="${request.contextPath}/statics/css/app/master_app.css">
</head>
<body>

<div id="rrapp" v-cloak>
    <div class="container">
        <div class="main"></div>
    </div>

    <div v-show="showList" style="margin-bottom:15px;">
        <div class="grid-btn">
            <div class="col-sm-2">
                <div class="input-group">
					<span class="input-group-btn">
						<button class="btn btn-default" type="button">
							<a @click="openDeptLayer"><i class="fa fa-android"></i>&nbsp;点击选择小区</a>
						</button>
					</span>
                    <input readonly class="form-control" type="text" v-model="q.dept" placeholder="请选择小区"/>
                </div>
            </div>
            <div class="col-sm-2" >
                <select v-model="q.date1" class="form-control" name="selQueryDate" id="selQueryDate"
                        style="padding-left:10px;padding-right:0px;">
                    <option value="">采集日期</option>
                    <option :value="item" v-for="(item,key) in dataDate" :key="key">{{ item }}
                    </option>
                </select>
            </div>
            <div class="col-sm-2" >
                <select v-model="q.cstatus" class="form-control" name="selQueryKey" id="selQueryKey"
                        style="padding-left:10px;padding-right:0px;">
                    <option value="">设备状态</option>
                    <option value="0">全部设备</option>
                    <option value="断路">故障设备</option>
                    </option>
                </select>
            </div>
            <div class="col-sm-2" >
                <input type="text" class="form-control" v-model="q.deviceId" placeholder="设备号"/>
            </div>
            <div class="col-sm-2" >
                <input type="text" class="form-control" v-model="q.cid" placeholder="表卡编号"/>
            </div>
            <div class="col-sm-2" >
                <input type="text" class="form-control" v-model="q.cname" placeholder="客户名称"/>
            </div>
            <div class="col-sm-2" >
                <input type="text" class="form-control" v-model="q.caddr" placeholder="客户地址"/>
            </div>

</div>
        <div class="btn-toolbar" role="toolbar">
            <div class="btn-group">


<a class="btn btn-primary" @click="query"><i class="fa fa-search"></i>&nbsp;查询</a>
<a class="btn btn-primary" @click="initData"><i class="fa fa-refresh"></i>&nbsp;刷新</a>
<a class="btn btn-primary" @click="outxls"><i class="fa fa-download"></i>&nbsp;导出</a>
<a class="btn btn-primary" href="/water/logout"><i class="fa fa-sign-out"></i> &nbsp;退出系统</a>
</div>
</div>

<table id="jqGrid"></table>
<div id="jqGridPager"></div>

</div>



<div id="deptLayer" style="display: none;">
    <input type="text" id="treeSearchKey" value="" class="empty" placeholder="请输入关键字" style="margin-left: 5px; margin-top: 5px;"/>
    <ul id="deptTreeLeft" class="ztree"></ul>
</div>

<div v-show="!showList" class="panel panel-default">
    <div class="panel-heading">{{title}}</div>
    <form class="form-horizontal">
        <div class="form-group">
            <div class="col-sm-2 control-label">表卡编号</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.clientId" placeholder="表卡编号"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">客户名</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.clientName" placeholder="客户名"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">客户地址</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.clientAddress" placeholder="客户地址"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">设备号</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.deviceId" placeholder="设备号"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">设备地址</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.deviceAddress" placeholder="设备地址"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">采集方式</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.typeName" placeholder="采集方式"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">设备状态</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.deviceStatus" placeholder="设备状态"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">状态码</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.statusCode" placeholder="状态码"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">采集日期</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.nowDate" placeholder="采集日期"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">采集数据</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.nowData" placeholder="采集数据"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">备注</div>
            <div class="col-sm-10">
                <input type="text" class="form-control" v-model="proData.memo1" placeholder="备注"/>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label"></div>
            <!--<input type="button" class="btn btn-primary" id="btnSaveOrUpdate" data-loading-text="保存中..."
                   @click="saveOrUpdate" value="确定"/>-->
            &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
        </div>
    </form>
</div>

<div id="infoLayer" style="display: none;padding:10px;">
    <div class="tabbable"> <!-- Only required for left/right tabs -->
        <ul id="myTab" class="nav nav-tabs">
            <li class="active"><a href="#tab1" data-toggle="tab">客户相关信息</a></li>
            <li><a href="#tab2" data-toggle="tab">设备相关信息</a></li>
            <li><a href="#tab3" data-toggle="tab">现场信息修改</a></li>
        </ul>
        <div class="tab-content">
            <div class="tab-pane active" id="tab1">
                <form class="form-horizontal">
                    <div class="form-group">
                        <div class="col-sm-2 control-label">表卡编号</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.clientId" placeholder="表卡编号" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">客户姓名</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.clientName" placeholder="客户姓名" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">客户地址</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.clientAddress" placeholder="客户地址" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">设备地址</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.deviceAddress" placeholder="设备地址" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">户号</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.hourseNum" placeholder="户号" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">仪表类型</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.typeName" placeholder="仪表类型" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">仪表状态</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.deviceStatus" placeholder="仪表状态" readonly/>
                        </div>
                    </div>
                </form>
            </div>
            <div class="tab-pane" id="tab2">
                <form class="form-horizontal">
                    <div class="form-group">
                        <div class="col-sm-2 control-label">设备号</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.deviceId" placeholder="设备号" readonly/>
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-sm-2 control-label">采集日期</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.nowDate" placeholder="采集日期" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">采集数据</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.nowData" placeholder="采集数据" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">IMEI</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.imei" placeholder="IMEI" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">质保开始日期</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.warrantyStart" placeholder="质保开始日期" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">现场记录</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.recordOnSpot" placeholder="现场记录" readonly/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">备注</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="proData.memo1" placeholder="备注" readonly/>
                        </div>
                    </div>
                </form>
            </div>
            <div class="tab-pane" id="tab3">
                <form class="form-horizontal">
                    <div class="form-group">
                        <div class="col-sm-2 control-label">安装日期</div>
                        <div class="col-sm-10">
                            <div class='input-group date'>
                                <input id='datetimepicker1' type="text" class="form-control"
                                       v-model="tClientInfo.desc1" placeholder="安装日期"/>
                                <span class="input-group-addon">
                                     <span class="glyphicon glyphicon-calendar"></span>
                                </span>
                            </div>
                        </div>
                    </div>

                <div class="form-group">
                    <div class="col-sm-2 control-label">表盘号</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="tClientInfo.meterCode"
                               placeholder="表盘号"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">表封号</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="tClientInfo.stampCode"
                               placeholder="表封号"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">换表时指针数</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="tClientInfo.desc3"
                               placeholder="换表时指针数"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">现场记录</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="tClientInfo.desc7" placeholder="现场记录"/>
                    </div>
                </div>
                    <div class="form-group">
                        <div class="col-sm-10"></div>
                        <div class="col-sm-2">
                            <script>hasSaveOrUpdatePermission = false;</script>
                            <#if shiro.hasPermission("water:tclientinfo:update")>
                            <script>hasSaveOrUpdatePermission = true;</script>
                            <a class="btn btn-primary" id="btnSaveOrUpdate" @click="updateClientInfo" data-loading-text="保存中..."><i class="fa fa-save"></i>&nbsp;保存修改</a>
                            </#if>
                        <#if shiro.hasPermission("water:tclientinfo:update1")>
                        <a class="btn btn-primary" id="btnSaveOrUpdate1" @click="updateClientInfo1" data-loading-text="保存中..."><i class="fa fa-save"></i>&nbsp;保存修改</a>
                    </#if>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

</div>


<script src="${request.contextPath}/statics/js/modules/app/prodata_app.js?_${.now?long}"></script>
</body>
</html>
